{% extends "news/base.html" %}

{% block title %}
    用户概况
{% endblock %}

{% block javascript %}
    <link rel="stylesheet" type="text/css" href="../../static/news/css/jquery.pagination.css">
    <script type="text/javascript" src="../../static/news/js/jquery.pagination.min.js"></script>
    <script type="text/javascript" src="../../static/news/js/other.js"></script>
{% endblock %}

{% block rank_title -%}
{%- endblock %}

{% block content -%}
    <div class="user_menu_con fl">
        <div class="user_center_pic">
            <img src="{% if author.avatar_url %}
                        {{ author.avatar_url }}
                    {% else %}
                        ../../static/news/images/person01.png
                    {% endif %}" alt="用户图片">
        </div>
        <div class="user_center_name">{{ author.nick_name }}</div>

        <ul class="other_detail">
            <li>性 别：{{ author.gender }}</li>
            <li>签 名：{{ author.signature }}</li>
        </ul>

        <div class="focus_other">
            <a href="javascript:;" class="focus" data-userid="{{ author.id }}"
               {% if isfollower %}style="display: none"{% endif %}>关注</a>
            <a href="javascript:;" class="focused" data-userid="{{ author.id }}"
               {% if not isfollower %}style="display: none"{% endif %}><span
                    class="out">已关注</span><span class="over">取消关注</span></a>
        </div>

    </div>

    <div class="user_con fr">
        <div class="other_collect">
            <h3>他的文章</h3>
            <ul class="article_list">

                {% for news in collections -%}
                    <li><a href="javascript:;"
                           data_newsid="{{ news.id }}">{{ news.title }}</a><span>{{ news.create_time }}</span></li>
                {%- endfor %}
            </ul>

            <div id="pagination" class="page"></div>

        </div>
    </div>

    <script>
        $(function () {

            //全局网页跳转，不只是刷新iframe
            $('.article_list').delegate('a', 'click', function () {
                var news_id = $(this).attr('data_newsid');
                window.location.href = "/" + news_id
            });


            // 分页功能
            $("#pagination").pagination({
                currentPage: {{ curr_page }},
                totalPage: {{ total_page }},
                callback: function (current) {
                    //window.location.href = "users/follow_list/" + current
                    $.ajax({
                        type: "GET",
                        url: "?page=" + current,
                        dataType: "json",
                        success: function (resp) {
                            //拼接html(这个部分根据自己的需求去实现)
                            totalPage = resp.total_page
                            var newses = resp.collections;
                            //console.log(users);
                            var htm = '';

                            newses.forEach(function (news) {
                                htm += '<li><a href="javascript:;" data_newsid="' + news.id + '">';
                                htm += news.title + '</a><span>' + news.create_time + '</span></li>';
                            });

                            $('.article_list').html(htm)
                        }
                    });
                }
            });
        });
    </script>
{%- endblock %}
